<template>
  <div class="home">
    <nav-tab-bar></nav-tab-bar>
    <van-search
      v-model="value"
      placeholder="请输入搜索关键词"
      show-action
      shape="round"
      @search="onSearch"
      >
      <div slot="action" @click="onSearch">搜索</div>
    </van-search>

    <van-index-bar :index-list="indexList">
      <div v-for="(list, index1) in dataList" :key="index1">
        <van-index-anchor :index="list.title"></van-index-anchor>
        <ul v-for="(item, index2) in list.content" :key="index2">
          <p>{{item.subTitle}}</p>
          <li v-for="(li, index3) in item.list" :key="index3">
            <img src="" alt="">
            <p>{{li.type}}</p>
          </li>
        </ul>
      </div>
     
    </van-index-bar>
  </div>
</template>

<script>

import NavTabBar from '../components/NavTabBar'
import ClassData from '../utils/classData'
export default {
  name: 'home',
  components: {
    NavTabBar
  },
  data () {
    return {
      value: '',
      indexList: [],
      dataList: ''
    }
  },
  mounted () {
    console.log(ClassData.data)
    this.dataList = ClassData.data
    this.dataList.map( item => {
      this.indexList.push(item.title)
    })
  },
  methods: {
    onSearch () {
      // 搜索
    }
  }
}
</script>
